<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/rp/common/taglib.jsp" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <base href="<%=basePath%>">
    
    <title>个人中心</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	
	<script src="rp/scripts/boot.js" type="text/javascript"></script>
	
	<style type="text/css">
	   	
    </style>
	
  </head>
  
  <body class="body-fit">
  	
  	<input id="userId" type="hidden" value="${ userId }" />
  	
  	<div id="tabs1" class="mini-tabs" activeIndex="0" tabPosition="left"
  		style="width:100%;height:100%;" bodyStyle="padding:0;border:0;">
  		<div title="基本资料">
  			<div style="padding: 15px;">
  				<form id="userInfoForm">
  					<input name="id" class="mini-hidden" />
	  				<table>
	  					<tr>
	  						<td valign="top">用户名：</td>
	  						<td>
	  							<input id="username" name="username" width="200" class="mini-textbox" readOnly="true"/>
	  							<br/>
	  							<span>用户名不可修改</span>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td valign="top">姓名：</td>
	  						<td>
	  							<input id="realname" name="realname" width="200" class="mini-textbox" required="true"/>
	  							<br/>
	  							<span>会话中的用户姓名需要重新登录才可生效</span>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td>性别：</td>
	  						<td>
	  							<input id="xb" name="xb" width="200" class="mini-textbox"/>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td>年龄：</td>
	  						<td>
	  							<input id="nl" name="nl" width="200" class="mini-textbox" vtype="int"/>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td>职位：</td>
	  						<td>
	  							<input id="zw" name="zw" width="200" class="mini-textbox"/>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td>手机：</td>
	  						<td>
	  							<input id="sj" name="sj" width="200" class="mini-textbox" vtype="int"/>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td>办公电话：</td>
	  						<td>
	  							<input id="bgdh" name="bgdh" width="200" class="mini-textbox" vtype="int"/>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td>邮箱：</td>
	  						<td>
	  							<input id="yx" name="yx" width="200" class="mini-textbox" vtype="email"/>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td valign="top">备注：</td>
	  						<td>
	  							<textarea id="remark" name="remark" class="mini-textarea" width="250" height="150" emptyText=""></textarea>
	  						</td>
	  					</tr>
	  					<tr>
	  						<td></td>
	  						<td>
	  							<a class="mini-button" onclick="submitForm()"><i class="fa fa-floppy-o fa-lg"></i> 保存</a>
	  						</td>
	  					</tr>
	  				</table>
	  			</form>
  			</div>
  			
  		</div>
  		<div title="其他设置">
  			<div style="padding: 10px;">
  				<a class="mini-button" onclick="clearLocalStorage();">清空所有本地存储</a>
  				<a class="mini-button" onclick="clearOptenMenus();">清空个人常用菜单记录</a>
  				<!-- <a class="mini-button" onclick="getOptenMenus();">获取本地存储的常用菜单</a> -->
  			</div>
  		</div>
  	</div>
  	
	<script type="text/javascript">
		var userInfoForm;
	
		$(function(){
			mini.parse();
			userInfoForm = new mini.Form("userInfoForm");
			initData();
		});
		
		function initData(){
			rp_ajax("rp/system/userInfoMng/getCurrentUserInfo", {}, function(result){
				var data = mini.decode(result);
				userInfoForm.setData(data);
				userInfoForm.setChanged(false);	
			});
		}
		
		function submitForm(){
			userInfoForm.validate();
            if (userInfoForm.isValid() == false) return;
            
          	//提交表单数据            
            var data = userInfoForm.getData();      //获取表单多个控件的数据
            var json = rp_encode(data);   //序列化成JSON
            
           	rp_ajax("rp/system/userInfoMng/updateUserInfo", {json:json, userId:$("#userId").val()}, function(result){
            	if(result == "success"){
            		mini.alert("保存成功");
            		initData();
            	}else{
            		mini.alert(result);
            	}
            });
		}
		
		function clearLocalStorage(){
			window.localStorage.clear();
			mini.alert("清空成功");
		}
		
		function clearOptenMenus(){
			window.localStorage.setItem("optenMenus", JSON.stringify([]));
			mini.alert("清空成功");
		}
		
		function getOptenMenus(){
			alert(window.localStorage.getItem("optenMenus"));
		}
	</script>
  </body>
</html>
